<template>
  <div class = "school"> 
    <h2>我是School组件（子组件）</h2>
     <button @click="handleSendName">点我把学校名交给App组件去展示</button>
    <h3>学校名称：{{name}}</h3>
    <h3>学校地址：{{address}}</h3>
   
  </div>
</template>

<script>
export default {
  name: 'School',
  data() {
    return {
      name: '尚硅谷',
      address: '宏福科技园',
    }
  },
  methods: {
    handleSendName() {
       this.$emit('getName',this.name)//触发School的vuecomponents
                                      //上的$emit方法实现getName调用
    },
  },
}
</script>
<style scoped>
    .school {
    background-color: orange;
    padding: 20px;
    }
</style>